<template>
 <div style="font-size: 12px;line-height: 60px;display: flex">

   <div style="flex: 1 ;font-size: 20px">
     <span :class="collapseBtnClass" style="cursor: pointer" @click="collapse"></span>

       <el-breadcrumb separator="/" style="display: inline-block;margin-left: 10px">
         <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
         <el-breadcrumb-item >{{ pathName }}</el-breadcrumb-item>
       </el-breadcrumb>

   </div>
   <el-dropdown style="width: 70px;cursor: pointer">
     <div style="display: inline-block">

       <img :src="manager.headImage" alt="" style="width: 30px;border-radius: 50%;position: relative;top:10px;right: 30px">
       <span>{{ manager.manageName }}</span>

     </div>
     <el-dropdown-menu slot="dropdown" >

       <el-dropdown-item  >
         <span style="text-decoration: none" @click="$router.push('/managerPerson')">
<!--           <router-link to="/managerPerson">个人信息</router-link>-->
           个人信息
         </span>

       </el-dropdown-item>
       <el-dropdown-item>
         <span  style="text-decoration: none" @click="logout"> 退出</span></el-dropdown-item>
     </el-dropdown-menu>


   </el-dropdown>
 </div>



</template>

<script>

export default {
  name:"Header",
  props:{
    collapseBtnClass:String,
    collapse:Boolean,

  },
  data(){
    return{
      pathName:'',
      manager: localStorage.getItem("manager")?JSON.parse(localStorage.getItem("manager")):{}
    }
  },
  watch:{
    '$route':function (){
      this.pathName=localStorage.getItem("currentPathName")
    }
  },
  methods:{
    logout(){
      this.$router.push("/manageLogin")
      localStorage.removeItem("manager")
      this.$message.success("退出成功")
    },
    toPerson(){
      this.$router.push("/managerPerson")
    }
  }

}

</script>